<!DOCTYPE html>
<html>
<head>
    <title>后台管理</title>
    <meta charset="UTF-8">
    <link href="https://cdn.jsdelivr.net/npm/wangeditor@4.7.15/dist/css/wangEditor.min.css" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/wangeditor@4.7.15/dist/wangEditor.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.6.0/jszip.min.js"></script>
    <style>
        /* 保留原有样式 */
        
        /* 添加电子书管理相关样式 */
        .book-list {
            list-style: none;
            padding: 0;
            margin: 10px 0;
        }
        .book-item {
            padding: 10px;
            margin: 5px 0;
            cursor: pointer;
            border-radius: 4px;
        }
        .book-item:hover {
            background: #e0e0e0;
        }
        .book-item.active {
            background: #1890ff;
            color: white;
        }
        .editor-container {
            border: 1px solid #ddd;
            border-radius: 4px;
            margin-top: 20px;
        }
        .book-toolbar {
            padding: 10px;
            background: #f8f8f8;
            border-bottom: 1px solid #ddd;
            margin-bottom: 10px;
        }
        /* 其他样式保持不变 */
    </style>
</head>
<body>
    <div class="container">
        <div class="sidebar">
            <h2>后台管理</h2>
            <ul class="nav-list">
                <li onclick="showSection('messages')">留言管理</li>
                <li onclick="showSection('feedback')">意见反馈</li>
                <li onclick="showSection('books')">电子书管理</li>
            </ul>
        </div>
        
        <div class="main-content">
            <!-- 留言管理部分 -->
            <div id="messages" class="section">
                <!-- 原有的留言管理代码 -->
            </div>

            <!-- 意见反馈部分 -->
            <div id="feedback" class="section" style="display: none;">
                <!-- 原有的意见反馈代码 -->
            </div>

            <!-- 电子书管理部分 -->
            <div id="books" class="section" style="display: none;">
                <h2>电子书管理</h2>
                <div class="book-toolbar">
                    <button onclick="saveBook()" class="btn">保存</button>
                    <button onclick="exportBook()" class="btn">导出电子书</button>
                    <button onclick="exportBookData()" class="btn">导出数据</button>
                    <button onclick="document.getElementById('importFile').click()" class="btn">导入数据</button>
                    <label class="btn">
                        设置封面图
                        <input type="file" id="coverImage" accept="image/*" style="display: none;">
                    </label>
                    <span id="bookSuccessTip" style="display: none; color: green;">保存成功！</span>
                </div>
                
                <div style="display: flex;">
                    <div style="width: 200px; margin-right: 20px;">
                        <ul class="book-list" id="bookList"></ul>
                    </div>
                    <div style="flex: 1;">
                        <div id="bookEditor" class="editor-container"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <input type="file" id="importFile" accept=".json" style="display: none">

    <script>
        let editor;
        let currentBookId = null;

        // 显示不同的管理部分
        function showSection(sectionId) {
            document.querySelectorAll('.section').forEach(section => {
                section.style.display = 'none';
            });
            document.getElementById(sectionId).style.display = 'block';

            // 如果切换到电子书管理，初始化编辑器
            if (sectionId === 'books' && !editor) {
                initBookEditor();
                loadBooks();
            }
        }

        // 初始化电子书编辑器
        function initBookEditor() {
            editor = new wangEditor('#bookEditor');
            editor.config.height = 500;
            editor.create();
        }

        // 加载电子书列表
        async function loadBooks() {
            try {
                const response = await fetch('books/data/books.json?' + new Date().getTime());
                const data = await response.json();
                
                const bookList = document.getElementById('bookList');
                bookList.innerHTML = data.books.map(book => `
                    <li class="book-item" onclick="selectBook(${book.id})" data-id="${book.id}">
                        ${book.title}
                    </li>
                `).join('');

                if (data.books.length > 0 && !currentBookId) {
                    selectBook(data.books[0].id);
                }
            } catch (error) {
                console.error('加载电子书列表失败:', error);
            }
        }

        // 选择电子书
        async function selectBook(bookId) {
            currentBookId = bookId;
            
            document.querySelectorAll('.book-item').forEach(item => {
                item.classList.remove('active');
                if (item.dataset.id == bookId) {
                    item.classList.add('active');
                }
            });

            try {
                const response = await fetch('books/data/books.json');
                const data = await response.json();
                const book = data.books.find(b => b.id === bookId);
                if (book) {
                    editor.txt.html(book.content);
                }
            } catch (error) {
                console.error('加载电子书内容失败:', error);
            }
        }

        // 保存电子书内容
        async function saveBook() {
            if (!currentBookId) return;

            try {
                const response = await fetch('books/data/books.json');
                const data = await response.json();
                const book = data.books.find(b => b.id === currentBookId);
                if (book) {
                    book.content = editor.txt.html();
                    
                    await fetch('books/save_book.php', {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'application/json'
                        },
                        body: JSON.stringify(data)
                    });

                    const successTip = document.getElementById('bookSuccessTip');
                    successTip.style.display = 'inline';
                    setTimeout(() => {
                        successTip.style.display = 'none';
                    }, 2000);
                }
            } catch (error) {
                console.error('保存失败:', error);
                alert('保存失败，请重试');
            }
        }

        // 其他电子书相关函数（exportBook, exportBookData, handleCoverImage 等）
        // ... 从之前的代码中复制过来，注意修改文件路径

        // 页面加载完成后初始化
        document.addEventListener('DOMContentLoaded', () => {
            // 显示默认页面
            showSection('messages');
            
            // 添加文件上传事件监听
            document.getElementById('coverImage').addEventListener('change', handleCoverImage);
            document.getElementById('importFile').addEventListener('change', importBookData);
        });
    </script>
</body>
</html> 